<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset="UTF-8">
<title>slot</title>
<script src='./vue.js'></script>
</head>
<body>
<div id="app">
<child>
<div class="header" slot="header">header</div>
<div class="footer" slot="footer">footer</div>
</child>
</div>
<script>
Vue.component('child',{
template:'<div><slot name="header"></slot><div class="content">content</div><slot name="header"></slot></div>'})
//在子组件里插槽加东西不会起作用，插槽用来存放父组件向子组件传递的html标签
var vm=new Vue({
el:"#app"})
</script>
</body>